<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('二串一')" />
	<style type="text/css">
		#menu{
			width: 0; /*设置为0 隐藏自定义菜单*/
			height: 60px;
			overflow: hidden; /*隐藏溢出的元素*/
			box-shadow: 0 1px 1px #888,1px 0 1px #ccc;
			position: absolute; /*自定义菜单相对与body元素进行定位*/
			z-index: 999;
			background-color: #ffffff;
		}
		.menu{
			width: 130px;
			height: 25px;
			line-height: 25px;
			padding: 0 10px;
			background-color: #ffffff;
       		color: #000000;
		}
		.menu:hover {
       		background-color: #66FFFF;
       		color: #ffffff;
       		cursor:pointer;
       	}
		
	</style>
</head>
<body class="gray-bg">
	<div class="container-div">
		<div class="row">
			<div class="col-sm-12 search-collapse">
				<form id="post-form">
					<div class="select-list">
						<ul>
							<li>
								投注金额：<input type="text"  value="10000" id="tzje"/>
							</li>
							<li>
								竞彩返点：<input type="text" value="0.095"  id="jcfd"/>
							</li>
							<li>
								HG返点：<input type="text" value="0.023"  id="hgfd"/>
							</li>
							<li>
								收益率大于：<input type="text"  id="syl"/>%
							</li>
							<li>
								返还率大于：<input type="text" value="96"  id="fhl"/>%
							</li>
							<li>
								收益大于：<input type="text" id="sy"/>
							</li>
							<li>
								利润达标提醒设置：<input type="text" value="300" id="lrdb"/>
							</li>
							<li>
								<a class="btn btn-primary btn-rounded btn-sm" id="set"><i class="fa fa-cog"></i>&nbsp;设置</a>
							    <!-- <a class="btn btn-warning btn-rounded btn-sm" id="resetTime"><i class="fa fa-clock-o"></i>&nbsp;设置刷新时间</a>
								<span style="color: red;" id="timeText">10s</span><span>秒刷新</span>
								<input type="hidden" value="10" id="time"/> -->
							</li>
						</ul>
					</div>
				</form>
			</div>
	        
	        <div class="col-sm-12 select-table table-striped" id="continer" style="overflow-y: scroll;height: 650px">
	        	
			</div>
			<div id="rightDH" style="float: right; margin-right: 100px;">
				<table class="gridtable righttable" style="background-color: rgb(199, 199, 215); position: absolute; z-index: 999; margin-top: 8%; top: -60px;">
				</table>
			</div>
		</div>
		<div id="menu">
			<div class="menu" onclick="addFisrt()">添加第一行</div>
			<div class="menu" onclick="addSecond()">添加第二行</div>
		</div>
	</div>
	<th:block th:include="include :: footer" />
	<script th:inline="javascript">
		function cellStylesales(value, row, index) {
			return {css:{background:'rgba(0, 255, 0, 0.2)'}};
		};
		var prefix = ctx + "system/manager";
		var rowData, menuVisible;
		function openStTable(t){
			var majorRow = {};
            majorRow.title = t.homeField + " VS " + t.opponentField,
            majorRow.betAmount = $('#tzje').val(),
            majorRow.jc = t.lotteryPlateOdds.split("：")[1],
            majorRow.flat = t.flatPlateOdds.split("：")[1],
            majorRow.hg = t.peripheryPlateOdds.split("：")[1],
            majorRow.betMoneyFlat = t.betMoneyFlat,
            majorRow.betMoneyPeriphery = t.betMoneyPeriphery,
            majorRow.Income1 = t.income1,
            majorRow.TotalExpense = t.totalExpense,
            majorRow.profit = t.income1 + t.betMoneyJingCai * $('#jcfd').val() - t.totalExpense
            localStorage.setItem("dggpDetail", JSON.stringify(majorRow));
            $.modal.open(majorRow.title, prefix+'/dggp/detail', 800, 300, function(){
            	
            });
		};
		var patamTableData=[];
		var requestForm = {};
		var addFisrt = function() {
            patamTableData[0] = {},
            patamTableData[0].title = "",
            patamTableData[0].type = "返水",
            patamTableData[0].jc = 100 * $('#jcfd').val() + "%",
            patamTableData[0].flat = 100 * $('#hgfd').val() + "%",
            patamTableData[0].hg = 100 * $('#hgfd').val() + "%",
            patamTableData[1] = {},
            patamTableData[1].title = rowData.serialNumber + "_" + rowData.leagueName + " => " + rowData.homeField + " Vs " + rowData.opponentField,
            patamTableData[1].type = rowData.type,
            patamTableData[1].jc = rowData.lotteryPlateOdds,
            patamTableData[1].flat = rowData.flatPlateOdds,
            patamTableData[1].hg = rowData.peripheryPlateOdds,
            patamTableData[1].RewordReturn = (100 * rowData.rewordReturn).toFixed(2) + "%",
            requestForm.OriginOddsWinLose1 = rowData.lotteryPlateOdds.split("：")[1],
            requestForm.OriginOddsFlat1 = rowData.flatPlateOdds.split("：")[1],
            requestForm.OriginOddsPeriphery1 = rowData.peripheryPlateOdds.split("：")[1]
        };
        var addSecond = function() {
            0 !== patamTableData.length ? (patamTableData[2] = {},
            patamTableData[2].title = rowData.serialNumber + "_" + rowData.leagueName + " => " + rowData.homeField + " Vs " + rowData.opponentField,
            patamTableData[2].type = rowData.type,
            patamTableData[2].jc = rowData.lotteryPlateOdds,
            patamTableData[2].flat = rowData.flatPlateOdds,
            patamTableData[2].hg = rowData.peripheryPlateOdds,
            patamTableData[2].RewordReturn = (100 * rowData.rewordReturn).toFixed(2) + "%",
            requestForm.OriginOddsWinLose2 = rowData.lotteryPlateOdds.split("：")[1],
            requestForm.OriginOddsFlat2 = rowData.flatPlateOdds.split("：")[1],
            requestForm.OriginOddsPeriphery2 = rowData.peripheryPlateOdds.split("：")[1],
            patamTableData[1].type ? openDialogTable(!0) : $.modal.msgWarning("请先添加第一行再添加第二行")) : $.modal.msgWarning("请先添加第一行再添加第二行")
        };
        var resData = {};
        var openDialogTable = function(e) {
        	var r = {};
            r.Kind1 = patamTableData[1].type,
            r.Kind2 = patamTableData[2].type,
            r.OriginOddsWinLose1 = requestForm.OriginOddsWinLose1,
            r.OriginOddsFlat1 = requestForm.OriginOddsFlat1,
            r.OriginOddsPeriphery1 = requestForm.OriginOddsPeriphery1,
            r.OriginOddsWinLose2 = requestForm.OriginOddsWinLose2,
            r.OriginOddsFlat2 = requestForm.OriginOddsFlat2,
            r.OriginOddsPeriphery2 = requestForm.OriginOddsPeriphery2,
            r.BetMoneyWinLose = resData.BetMoneyDoubleToOne ? resData.BetMoneyDoubleToOne : $('#tzje').val(),
            r.LotteryRtnWater = $('#jcfd').val(),
            r.PeripheryRtnWater = $('#hgfd').val(),
            r.ProfitAdjust = 2,
            r.RewardSetting = 0;
        	localStorage.setItem("requestForm", JSON.stringify(requestForm));
        	localStorage.setItem("patamTableData", JSON.stringify(patamTableData));
        	localStorage.setItem("resData", JSON.stringify(r));
			$.modal.open("信息展示", prefix+'/detail/info', 1200, 700, function(){
            	
            });
        };
		var options1 = {
				showRefresh: false,
	            showColumns: false,
				showToggle: false,
				showSearch: false,
				onClickCell: function(field, value, row, $element){
					6 === field && openStTable(row);
				},
				onDblClickRow: function(row, $element){
					rowData = row;
					//获取我们自定义的右键菜单
					var menu=document.querySelector("#menu");
					//根据事件对象中鼠标点击的位置，进行定位
					var e = window.event;
					menu.style.left=e.clientX+'px';
					menu.style.top=e.clientY+'px';
					//改变自定义菜单的宽，让它显示出来
					menu.style.width='125px';
				},
		        columns: [
					{
						field: 'type',
						title: '类型'
					},
					{
						field: 'lotteryPlateOdds',
						title: '竞彩',
						cellStyle:cellStylesales,
						formatter: function(value, row, index) {
			                return '<span style="color:blue;">'+value+'</span>';
			            }
					},
					{
						field: 'flatPlateOdds',
						title: '',
						cellStyle:cellStylesales,
						formatter: function(value, row, index) {
							if(value.indexOf('J')>-1) return '<span style="color:blue;">'+value+'</span>';
			                return '<span style="color:#FF0066;">'+value+'</span>';
			            }
					},
					{
						field: 'peripheryPlateOdds',
						title: '外围',
						cellStyle:cellStylesales,
						formatter: function(value, row, index) {
							if(value.indexOf('J')>-1) return '<span style="color:blue;">'+value+'</span>';
			                return '<span style="color:#FF0066;">'+value+'</span>';
			            }
					},
					{
						field: 'profitLotteryPercent',
						title: '收益',
						formatter: function(value, row, index) {
							var profitLotteryPercent = ((row.income1 + row.betMoneyJingCai * $('#jcfd').val() - row.totalExpense) / row.betMoneyJingCai * 100).toFixed(2);
							if(profitLotteryPercent>0) return '<span style="color:red;">'+profitLotteryPercent+'%</span>';
			                return '<span style="color:#00CC00;">'+profitLotteryPercent+'%</span>';
			                return 
			            }
					},
					{
						filed: 'rewordReturn',
						title: '返回',
						formatter: function(value, row, index) {
							var rewordReturn = (100 * row.rewordReturn).toFixed(2) + "%";
			                return '<span style="color:#00CC00;">'+rewordReturn+'</span>';
			            }
					},
					{
						filed: 'profit',
						title: '利润',
						formatter: function(value, row, index) {
							var jcReturn = $('#jcfd').val();
							var profit = (row.income1 + row.betMoneyJingCai * jcReturn - row.totalExpense).toFixed(2);
							if(profit>0) return '<span style="color:red;">'+profit+'</span>';
			                return '<span style="color:#00CC00;">'+profit+'</span>';
			            }
					}
			    ]
		};
		var options2 = {
				showRefresh: false,
	            showColumns: false,
				showToggle: false,
				showSearch: false,
		        columns: []
		};
		var times = $('#time').val();
		if(localStorage.getItem("time")) {
			times = localStorage.getItem("time");
			$('#time').val(times);
		}
        var setTimes = function() {
        	setInterval((function() {
        		times =  times-1;
        		if(times < 0) {
        			times = $('#time').val();
        			getData(true)
        		}
                $('#timeText').text(times+"s");
            }), 1e3)
		};
		var renderTable = function(result) {
			// result = res.data;
			if(!result || result<1) return;
			rowDataList = result;
			var dateDiff = function(t) {
                var e = new Date
                  , r = new Date(t)
                  , i = (r - e) / 1e3
                  , a = parseInt(i / 86400)
                  , n = parseInt(i / 3600) - 24 * a
                  , o = parseInt(i % 3600 / 60)
                  , l = parseFloat((o / 60).toFixed(1));
                return 24 * a + n + l + "小时后开赛"
            };
			function renderItem(item,index) {
				var html = [];
				html.push('<div class="row">')
				html.push('<h4 class="col-sm-12 form-header h4" id="'+item.serialNumber+'">'+index+'.【'+item.serialNumber+'】'+dateDiff(item.startTime)+'('+item.startTime+')'+item.leagueName + ' => ' + item.homeField + 'Vs '+ item.opponentField+'</h4>');
				html.push('<div class="col-sm-7">');
				html.push('	<table id="bootstrap-table1" class="bootstrap-table1"></table>');
				html.push('</div>');
				html.push('<div class="col-sm-5">');
				html.push('	<table id="bootstrap-table2"></table>');
				html.push('</div>');
				html.push('</div>');
				var html = $(html.join('\r\n'));
				return html;
			}
			var continer = $('#continer');
			continer.empty();
			for(var i=0; i<result.length; i++) {
				var div = renderItem(result[i], i+1);
				var table1 = div.find('#bootstrap-table1');
				var table2 = div.find('#bootstrap-table2');
				continer.append(div);
				options1.data = result[i].eventHedgeProfitsDoubleToSingle;
				var eventPlateDoubleToOneDetailInfo = result[i].eventPlateDoubleToOneDetailInfos[0];
				var cl = [];
				var tit = ['website','plate', 'homeFieldWater', 'flatWater', 'opponentFieldWater'];
				for(var k=0; k<tit.length; k++) {
					var json = {
							field: tit[k],
							title: eventPlateDoubleToOneDetailInfo[tit[k]]
						};
					if(json.title==='盘口') {
						json.formatter = function(value, row, index) {
			                return '<span style="color:#00CC00;">'+value+'</span>';
			            }
					}
					if(tit[k]=='homeFieldWater'||tit[k]=='flatWater'||tit[k]=='opponentFieldWater') {
						json.formatter = function(value, row, index) {
							if(!value || value=="") return value;
			                return parseFloat(value).toFixed(2);
			            }
					}
					cl.push(json);
				}
				options2.columns = cl;
				result[i].eventPlateDoubleToOneDetailInfos.splice(0,1);
				options2.data = result[i].eventPlateDoubleToOneDetailInfos;
				table1.bootstrapTable(options1);
				table2.bootstrapTable(options2);
			}
			addModalEl(result);
		};
        var getData = function(isReset) {
			// var baseUrl = "http://83t95.xyz:8090/api/Double?t="+(new Date).getTime();
			var baseUrl = prefix + "/double/list";
			$.operate.get(baseUrl, renderTable, true, isReset);
        };	
        
        var getDataV2 = function(isReset) {
			var baseUrl = prefix + "/ecy/list?t="+(new Date).getTime();
			$.operate.get(baseUrl, renderTable, true, isReset);
        };
        
        var addModalEl = function(dataArray) {
        	if(!dataArray || dataArray.length<1) return;
            var e = document.querySelector(".righttable");
            if (e.childNodes)
                while (e.hasChildNodes())
                    e.removeChild(e.firstChild);
            for (var t = "", r = [], a = 0; a < dataArray.length; a++) {
                var i = dataArray[a]
                  , o = 100 * i.eventHedgeProfitsDoubleToSingle.sort((function(e, t) {
                    return t.rewordReturn - e.rewordReturn
                }
                ))[0].rewordReturn;
                var returnRouto = $('#fhl').val();
                o >= returnRouto && (-1 == r.indexOf(i.StartTime) ? (t += '<tr><td style="padding:0px;border-style: hidden;"><table>',
                t += '<tr><td style="background-color: black;color:white;">' + i.serialNumber.substring(0, 2) + i.startTime.substring(10, 16) + "</td></tr>",
                t += '<tr><td><a onclick="javascript:location.href=\'#' + i.serialNumber + '\'">' + i.serialNumber + '<br><span class="fontw" style="color:red">' + o.toFixed(2) + "</span>%</a></td></tr>",
                t += "</table></td></tr>") : t += '<tr><td><a onclick="javascript:location.href=\'#' + i.serialNumber + '\'">' + i.serialNumber + '<br><span class="fontw" style="color:red">' + o.toFixed(2) + "</span>%</a></td></tr>",
                r.push(i.startTime))
            }
            e.insertAdjacentHTML("beforeEnd", t)
        };
        
		$(function() {
			getData();
			/*setTimes();
			$('#resetTime').on('click', function(){
				layer.prompt({title: '输入刷新时间单位(秒)', formType: 0}, function(pass, index){
					if(!pass || pass=='') return $.modal.msgWarning("请填写刷新时间");
					if(parseFloat(pass).toString() == "NaN") return $.modal.msgWarning("请填写正整数");
					$('#time').val(pass);
					localStorage.setItem("time",pass);
					layer.close(index);
				});
			});*/
			$('#set').on('click',function(){
				var tableList = $('.bootstrap-table1');
				if(!tableList || tableList.length<1) return;
				for(var i=0; i<tableList.length; i++) {
					var tableData= $(tableList[i]).bootstrapTable('getData',{useCurrentPage:true,includeHiddenRows:true});
					$(tableList[i]).bootstrapTable('load',tableData);
				}
			});
			//关闭右键菜单，很简单
			window.onclick=function(e){
				//用户触发click事件就可以关闭了，因为绑定在window上，按事件冒泡处理，不会影响菜单的功能
				e.preventDefault();
				document.querySelector('#menu').style.width=0;
			}
		});
	</script>
</body>
</html>